import React from 'react'
import { Route, Switch, Redirect, withRouter }  from 'react-router-dom'
// import { menu } from '../config/menu'
import { connect } from 'react-redux'
import NotFound from '../views/NotFound/NotFound'

function menuRouter(props) {
    console.log(props)
    // return

    const beformRouter = () => {
        console.log('---------------------------------------------------')
        if(props.location.pathname === '/' || props.location.pathname === '') {
            console.log('重定向')
            // props.history.replace('/home')
            return <Redirect to='/home' />
        }
        return <NotFound></NotFound>
    }
  return (
    <Switch>
        {
            // 路由获取成功再渲染路由
            props.routes.length && props.routes.map(item => {
                if (item.children?.length) {
                    return item.children.map(cItem => {
                        return <Route path={cItem.key} component={cItem.component} key={cItem.key}></Route>
                        // return <Route path={cItem.key} key={cItem.key} render={(props2) => {
                        //     console.log('*****************************************************************')
                        //     console.log(props2)
                        //     return <cItem.component {...props2}/>
                        // }}></Route>
                    })
                } else {
                    return <Route path={item.key} component={item.component} key={item.key}></Route>
                    // return <Route path={item.key} key={item.key} render={(props3) => {
                    //     return <item.component {...props3}/>
                    // }}></Route>
                }
            })
        }
        {
            props.routes.length && 
            (
                <>
                    {/* <Redirect from='/' to='/home' exact></Redirect> */}
                    <Route path='*' render={beformRouter}></Route>
                </>
            )
        }
    </Switch>
  )
}

export default connect((state) => {
    return {
        routes: state.RouterReducer
    }
})(withRouter(menuRouter))
